<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no">
    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">
    <title>借出</title>
    <link href="../Content/css/style.css" rel="stylesheet">
    <link href="../Content/css/iosSelect.css" rel="stylesheet">
    <script src="../Content/js/rem.js"></script>
    <style>
        .jkrlist li a.jkbtn{
            color:#3cced9;border: 1px solid #3cced9;    margin: 10px 0;
        }
        .jkrlist li{
            height: 65px;
        }
        p.jkxx{
            font-size: 12px;
            width: 120px;
            text-align: center;
            position: absolute;
            top: 40px;
            left: 50%;
            margin-left: -60px;
        }
        .jkrlist li .cjje {
            line-height: 45px;
        }
    </style>
</head>
<body>
    <div class="wrap">
        <div class="seabox">
            <input class="seainput" placeholder="请输入手机号码" id="input">
            <a href="javascript:;" class="seabtn" onclick="seabtn()">搜索</a>
        </div>
        <div class="jktop">
            <img src="../Content/imgs/jktop.jpg">
        </div>

        <div class="box">
            <div class="bcon">
                <div class="list_lh">
                    <ul>
                        <li>
                            <p>张*兰注册成为新用户</p>
                        </li>
                        <li>
                            <p>李*注册成为新用户</p>
                        </li>
                        <li>
                            <p>刘*注册成为新用户</p>
                        </li>
                        <li>
                            <p>曹*英注册成为新用户</p>
                        </li>
                        <li>
                            <p>刘*美注册成为新用户</p>
                        </li>
                        <li>
                            <p>赵*侠注册成为新用户</p>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="btnbox">
            <div class="btn wydk">我要出借</div>
            <div class="btn jyjl">出借记录</div>
        </div>
        <div class="cjrbox">
            <div class="xzbox">
                <p class="cjrnum">发现求借人(<span id="L"></span>)</p>
                <div class="pc-box">
                    <input type="hidden" name="bank_id" id="bankId" value="">
                    <span id="showBank">按芝麻分筛选</span>
                </div>
            </div>

            <ul class="jkrlist" id="jkrlist">
                <!--<li>-->
                    <!--<p class="cjje">5000-10000</p>-->
                    <!--<div class="cjrxx"><img src="../Content/imgs/gril.jpg"><span>张*君</span></div>-->
                    <!--<p class="jkxx">10000.00|24%|200天</p>-->
                    <!--<a class="jkbtn">借给TA</a>-->
                <!--</li>-->
            </ul>
        </div>
    </div>
    <ul class="footer" id="footer">
        <li class="jr">借入</li>
        <li class="jc  active">借出</li>
        <li class="xx">消息</li>
        <li class="jl">交易</li>
        <li class="wd">我的</li>
    </ul>
    <script src="../Content/js/jquery-2.2.4.min.js"></script>
    <script src="../Content/js/scroll.js"></script>
    <script src="../Content/js/iosiscroll.js"></script>
    <script src="../Content/js/iosSelect.js"></script>
    <script src="../Content/js/layer-mobl.js"></script>
<script>
    //判断登录
    var dlzt=false;
    if(localStorage.phonenum==undefined||localStorage.phonenum=="undefined" || localStorage.phonenum==""){
        dlzt=false
    }else {
        dlzt=true;
    }
    //var url="http://192.168.199.136:8080/daiqianlai";

    $.ajax({
        type : "GET",
        url :localStorage.url+"/loan/getBorrowUser",
        dataType : 'json',
        async: false,
        contentType : "application/json",
        data :{
            page:1,
            zm:500
        },
        success : function(ro) {
            console.log(ro);
            var strs="";

            $("#L").html(ro.count);
            $.each(ro.userList,function (index,el) {
                var rote=Math.floor(ro.userList[index].rate*100);
                var Name="";
                if(ro.userList[index].name.length==2){
                    Name= ro.userList[index].name.substring(0,1)+"*"
                }else if(ro.userList[index].name.length==3){
                    Name= ro.userList[index].name.substring(0,1)+"*"+ro.userList[index].name.substring(2,3)
                }else if(ro.userList[index].name.length==4){
                    Name= ro.userList[index].name.substring(0,1)+"**"+ro.userList[index].name.substring(3,4)
                }
                strs+=`<li data-id=`+ro.userList[index].id+` onclick="gotujiegeta(this)">
                    <p class="cjje">`+ro.userList[index].borrow_money+`</p>
                    <div class="cjrxx"><img src=`+ro.userList[index].tou+`><span>`+Name+`</span></div>
                    <p class="jkxx">`+ro.userList[index].borrow_money+`  |  `+rote+`%  |  `+ro.userList[index].duration+`天</p>
                    <a class="jkbtn">借给TA</a>
                </li>`
            });
            $(strs).appendTo("#jkrlist");
            $("#loading").hide();
        },
        error : function(err) {
            alert(err);
        }
    });
    function seabtn() {
        var phone=$("#input").val();
        if(phone=="" || phone.length!=11){
            layer.open({
                content:"手机号输入有误",
                time:1
            });
            return
        }else {
            $.ajax({
                type : "GET",
                url :localStorage.url+"/loan/findBorrowUserByPhonenum",
                dataType : 'json',
                async: false,
                contentType : "application/json",
                data :{
                    phonenum:$("#input").val()
                },
                success : function(ro) {
                    console.log(ro);
                    if(ro.length==0){
                        layer.open({
                            content:"此人暂无申请记录",
                            time:1
                        });
                    }else {
                        window.location.href="jiegeiTa.html?qjrid="+ro[0].id
                    }
                },
                error : function(err) {
                    console.log(err);
                }
            });
        }
    }
    $(function(){
        $("div.list_lh").myScroll({
            speed:40, //数值越大，速度越慢
            rowHeight:50 //li的高度
        });
        $(".wydk").on('click',function () {
            window.location.href="wyck.html"
        })
        $(".jyjl").on('click',function () {
            window.location.href="jiechuzijin.html"
        })
        $("#footer li").on('click',function () {
            var index=$(this).index();
            $(this).addClass('active').siblings().removeClass("active");
            console.log(index);
            if(index===0){
                window.location.href="index.html"
            }else if(index===1){
                window.location.href="chujie.html"
            }else if(index===2){
                if(!dlzt){
                    window.location.href="login.html";
                }else {
                    window.location.href="messages.html"
                }
            }else if(index===3){
                if(!dlzt){
                    window.location.href="login.html";
                }else {
                    window.location.href="jiaoyi.html"
                }
            }else if(index===4){
                if(!dlzt){
                    window.location.href="login.html";
                }else {
                    window.location.href="my.html"
                }
            }
        });

        var data = [
            {'id': '0', 'value': '650以上'},
            {'id': '1', 'value': '601-650'},
            {'id': '2', 'value': '581-600'},
            {'id': '3', 'value': '580以下'}
        ];
        var showBankDom = document.querySelector('#showBank');
        var bankIdDom = document.querySelector('#bankId');
        showBankDom.addEventListener('click', function () {
            var bankId = showBankDom.dataset['id'];
            var bankName = showBankDom.dataset['value'];

            var bankSelect = new IosSelect(1,
                [data],
                {
                    container: '.container',
                    title: '芝麻分选择',
                    itemHeight: 50,
                    itemShowCount: 3,
                    oneLevelId: bankId,
                    callback: function (selectOneObj) {
                        bankIdDom.value = selectOneObj.id;
                        showBankDom.innerHTML = selectOneObj.value;
                        showBankDom.dataset['value'] = selectOneObj.id;
                    }
                });
        });
    });
    function gotujiegeta(obj) {
        var $this=$(obj);
        var id=$this.attr("data-id");
        if(!dlzt){
            window.location.href="login.html"
        }else {
            window.location.href="jiegeiTa.html?qjrid="+id;
        }

    }
</script>
</body>
</html>
